<template>
  <!-- 检查事项 -->
  <div class="dialog-container">
    <el-dialog
      title="排口因子数据"
      :visible="dialogVisible"
      width="65%"
      @opened="initData"
      @close="closeDialog"
    >
      <el-tabs v-model="activeName" type="card">
        <el-tab-pane label="报警列表" name="1">
          <div style="padding: 0px 10px">
            <WarningTable ref="warningTable" :outlet-ids="outletId" @queryOther="handleQueryOther" />
          </div>
        </el-tab-pane>
        <el-tab-pane :label="(factorName || '')+'因子数据'" name="2" :disabled="tabDisabled">
          <div style="padding: 0px 10px">
            <el-tabs v-model="subTabActiveName">
              <el-tab-pane label="恒值" name="hz">
                <FactorTable ref="hzTable" type="hz" :is-chart="true" :outlet-id="outletId" :factor-id="factorId" />
              </el-tab-pane>
              <el-tab-pane label="超标" name="cb">
                <FactorTable ref="cbTable" type="cb" :outlet-id="outletId" :factor-id="factorId" factor-name="factorName" />
              </el-tab-pane>
            </el-tabs>
          </div>
        </el-tab-pane>
      </el-tabs>
    </el-dialog>
  </div>
</template>

<script>
import { getDictLabel } from '@/utils'
import WarningTable from './WarningTable'
import FactorTable from './FactorTable'

export default {
  name: 'WarningListDialog',
  components: {
    WarningTable, FactorTable
  },
  props: {
    dialogVisible: {
      type: Boolean,
      default: false
    },
    outletId: {
      type: Number,
      default: null
    },
    obj: {
      type: Object,
      default: null
    }
  },
  data() {
    return {
      activeName: '1',
      subTabActiveName: 'hz',
      tabDisabled: true,
      dataForm: {},
      factorId: null,
      factorName: null,
      time: null
    }
  },
  watch: {
    subTabActiveName(val) {
      if (val === 'hz') {
        this.$nextTick(() => {
          this.$refs.hzTable && this.$refs.hzTable.initTable(this.time)
        })
      } else {
        this.$nextTick(() => {
          this.$refs.cbTable && this.$refs.cbTable.initTable(this.time)
        })
      }
    }
  },
  created() {

  },
  methods: {
    getDictLabel,
    handleQueryOther(row, time = null) {
      console.log(row, time)
      this.time = time
      this.tabDisabled = false
      this.activeName = '2'
      this.subTabActiveName = 'hz'
      this.factorId = row.factorLibraryId
      this.factorName = row.alarmInformationObj ? row.alarmInformationObj.alarmFactor : ''
      this.$nextTick(() => {
        this.$refs.hzTable && this.$refs.hzTable.initTable(time)
      })
    },
    initData() {
      this.activeName = '1'
      this.subTabActiveName = 'hz'
      this.tabDisabled = true
      this.factorName = ''
      this.$refs.warningTable && this.$refs.warningTable.initTable()
    },
    closeDialog() {
      this.$emit('closeDialog')
      this.clearData()
    },
    clearData() {
      this.dataForm = {

      }
    }
  }
}
</script>

<style lang="scss" scoped>

</style>
